<!-- <button nz-button sunshine-permission permission="sys:user:info">权限按钮1</button> -->
<!-- <button nz-button sunshine-permission permission="sys:user:info2">权限按钮2</button> -->

<div>
    <form nz-form [formGroup]="validateForm" class="ant-advanced-search-form">
        <div nz-row [nzGutter]="24">
            <div nz-col [nzSpan]="4">
                <nz-form-item>
                    <nz-form-label>用户名:</nz-form-label>
                    <nz-form-control>
                        <input nz-input p formControlName="userName" />
                    </nz-form-control>
                </nz-form-item>
            </div>
            <div nz-col [nzSpan]="4">
                <nz-form-item>
                    <nz-form-label>邮箱:</nz-form-label>
                    <nz-form-control>
                        <input nz-input formControlName="email" />
                    </nz-form-control>
                </nz-form-item>
            </div>
            <div nz-col [nzSpan]="4">
                <nz-form-item>
                    <button nz-button nzType="primary">
                        <i nz-icon nzType="search"></i>
                        Search
                    </button>
                    <button nz-button [nzType]="'primary'">新增</button>
                </nz-form-item>
            </div>
        </div>
        <!-- <div nz-row>
            <div nz-col [nzSpan]="24" class="search-area">
                <button nz-button [nzType]="'primary'">Search</button>
                <button nz-button (click)="resetForm()">Clear</button>
            </div>
        </div> -->
    </form>
    <!-- <div class="search-result-list"> -->
    <nz-table nzShowSizeChanger [nzData]="listOfRandomUser" [nzFrontPagination]="false" [nzLoading]="loading"
        [nzTotal]="total" [nzPageSize]="pageSize" [nzPageIndex]="pageIndex"
        (nzQueryParams)="onQueryParamsChange($event)">
        <thead>
            <tr>
                <th nzColumnKey="name" [nzSortFn]="true">用户名</th>
                <th nzColumnKey="gender" [nzFilters]="filterGender" [nzFilterFn]="true">邮箱</th>
                <th nzColumnKey="email" [nzSortFn]="true">状态</th>
                <th nzColumnKey="email" [nzSortFn]="true">最后登录ip</th>
                <th nzColumnKey="email" [nzSortFn]="true">最后登录时间</th>
                <th nzColumnKey="email" [nzSortFn]="true">创建时间</th>
                <th nzColumnKey="email" [nzSortFn]="true">操作</th>
            </tr>
        </thead>
        <tbody>
            <tr *ngFor="let data of listOfRandomUser">
                <td>{{ data.name.first }} {{ data.name.last }}</td>
                <td>{{ data.gender }}</td>
                <td>{{ data.email }}</td>
                <td>{{ data.email }}</td>
                <td>{{ data.email }}</td>
                <td>{{ data.email }}</td>
                <td><button nz-button nzType="primary">
                        <i nz-icon nzType="search"></i>
                        Search
                    </button>
                    <button nz-button [nzType]="'primary'">新增</button>
                </td>
            </tr>
        </tbody>
    </nz-table>
    <!-- </div> -->
</div>